<div>
    <div>
        <div class="panel panel-default m-n">
            <div class="panel-heading font-bold">申请代理商</div>
            <form class="ng-valid form-horizontal" name="form" ng-submit="add(form)">
                <div class="panel-body">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">代理区域</label>
                        <div class="col-sm-8">
                            <ui-select id="agentAreaId" ng-model="agent.selected" ng-change="edChange()" reset-search-input="false" required>
                                <ui-select-match placeholder="没找到想要区/县级区域? 请到'代理区域'菜单新增">
                                    {{$select.selected.name}}
                                </ui-select-match>
                                <ui-select-choices
                                        group-by="'province'"
                                        repeat="a in uiSelectList | uiSelectPropsFilter: {name: $select.search, province: $select.search, city: $select.search, districts: $select.search}"
                                        refresh="refreshSelectList($select.search)"
                                        refresh-delay="100"
                                        style="max-height: 400px;">
                                    <div ng-bind-html="a.name"></div>
                                    <small class="opacity-04">
                                        <span ng-if="a.level == 0" class="province-color"
                                              ng-class="{areaActive: $select.isActive(this), disabled: $select.isDisabled(this)}">
                                            {{a.province}}
                                        </span>

                                        <span ng-if="a.level == 1">
                                            {{a.province}} -
                                            <span class="city-color"
                                                  ng-class="{areaActive: $select.isActive(this), disabled: $select.isDisabled(this)}">
                                                {{a.city}}
                                            </span>
                                        </span>

                                        <span ng-if="a.level == 2">
                                            {{a.province}} - {{a.city}} -
                                            <span class="district-color"
                                                  ng-class="{areaActive: $select.isActive(this), disabled: $select.isDisabled(this)}">
                                                {{a.districts}}
                                            </span>
                                        </span>
                                    </small>
                                </ui-select-choices>
                            </ui-select>
                        </div>
                    </div>
                    <div class="line line-dashed b-b line-lg pull-in"></div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">姓名</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" ng-model="agent.name" id="name" ng-trim="true" required>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">身份证</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" ng-model="agent.idCard" id="idCard" ng-trim="true" required>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">性别</label>
                        <div class="col-sm-8">
                            <div class="btn-group">
                                <label class="btn btn-default ng-pristine ng-untouched ng-valid"
                                       ng-model="agent.gender" btn-radio="0">女</label>
                                <label class="btn btn-default ng-pristine ng-untouched ng-valid"
                                       ng-model="agent.gender" btn-radio="1">男</label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">登陆帐号</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" ng-model="agent.mobilePhone" id="mobilePhone" ng-trim="true" placeholder="请勿填中文" required>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">联系地址</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" ng-model="agent.address" ng-trim="true">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">电子邮箱</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" ng-model="agent.email" ng-trim="true">
                        </div>
                    </div>
                </div>
                <div class="panel-footer text-right">
                    <div>
                        <button type="submit" class="btn m-b-xs w-xs btn-info">提交申请</button>
                        <button class="btn m-b-xs w-xs btn-default" ng-click="cancel()">取消</button>
                    </div>
                </div>
                </form>
            </div>
        </div>
    </div>
</div>